<template>
	<view>
		<view  class="lists p30">
			<view class="tops  bgw p30">
				<u-tabs :list="list" active-color="#1BBF80" :is-scroll="false" font-size="32" :current="current" @change="change"></u-tabs>
				<view class="nav">
					<view v-show="state == 0" @tap="setLike()" class="fr">
						管理
					</view>
					<view v-show="state == 1" @tap="setLikes()" class="fr">
						完成
					</view>
				</view>
			</view>
			
			<view v-if="current == 0" class="main">
				<view @tap="Tab(v,i)" v-for="(v,i) in data" :key="i" :class="{selectAct:state ==1}" class="box bgw">
					<view v-show="state == 1" class="">
						<image v-show="v.act ==0" class="select" src="../../static/image/nomal@2x.png"></image>
						<image v-show="v.act ==1" class="select" src="../../static/image/select@2x.png"></image>
					</view>
					<view class="shop">
						<image :src="v.product.thumbnail" mode="aspectFit"></image>
						<view v-if="v.product.isMarketable == false" class="noneGoods">
							已下架
						</view>
					</view>
					<view class="txt">
						<p class="p1 text-df two">
							{{v.product.name}}
						</p>
						<p class="p3 ">
							<view> ¥<span> {{v.product.price}} </span></view>
						</p>
					</view>
				</view>
			</view>
			<view v-if="current == 1" class="main">
				<view @tap="Tab(v,i)" v-for="(v,i) in data" :key="i" :class="{selectAct:state ==1}" class="box bgw">
					<view v-show="state == 1" class="">
						<image v-show="v.act ==0" class="select" src="../../static/image/nomal@2x.png"></image>
						<image v-show="v.act ==1" class="select" src="../../static/image/select@2x.png"></image>
					</view>
					<view class="shop">
						<image :src="v.store.headImg" mode="aspectFit"></image> 
					</view>
					<view class="txt">
						<p class="p1 text-df two">
							{{v.store.name}}
						</p>
						<p class="p3 " style="color: #666666;">
							 收藏量：{{v.store.favoriteCount}}
						</p>
					</view>
				</view>
			</view>
			<view v-if="state == 1" class="bottoms">
				<view @tap="all()" class="fl">
					<image v-show="allState == 0" class="vm" src="../../static/image/nomal@2x.png" mode=""></image>
					<image v-show="allState == 1" class="vm" src="../../static/image/select@2x.png" mode=""></image>
					全选
				</view>
				<view class="fr">
					<p @tap="delect()">删除</p>
				</view>
			</view>
		</view>
		<view v-if="data == '' " class=" dataNone">
			<image src="../../static/image/guanzhu@2x.png" mode=""></image>
			<p v-if="current == 0">暂无收藏商品</p>
			<p v-if="current == 1">暂无收藏店铺</p>
			<u-button @tap="GoIndex()" :ripple="true" shape="circle" type="success">
				去逛逛
			</u-button>
		</view>
	</view>
</template>

<script>
	import {
		favoriteList,
		favoriteCancel,
		storeFavoriteList,
		storeFavoriteCancel
	} from '../../api/api.js'
	export default {
		data() {
			return {
				list: [{
					name: '商品'
				}, {
					name: '店铺'
				}],
				current: 0,
				state: 0,
				data: [],
				pageNumber: 1,
				pageSize: 10,
				removes: [],
				stops: 0,
				allState: 0
			};
		},
		onLoad() {
			this.init()
		},
		onReachBottom() {
			if (this.stops == 0) {
				this.init()
			}
		},
		methods: {
			GoIndex() {
				uni.switchTab({
					url: '../index/index'
				})
			},
			async delect() {
				if(this.current == 0){
					for (let i = 0; i < this.data.length; i++) {
						if(this.data[i].act == 1){
							this.removes.push(this.data[i].product.id)
						} 
					}
				}else{
					for (let i = 0; i < this.data.length; i++) {
						if(this.data[i].act == 1){
							this.removes.push(this.data[i].store.id)
						} 
					}
				}
				
				let parameret = {
					ids: this.removes
				}
				let data = []
				if(this.current == 0){
					 data = await favoriteCancel(parameret)
				}else{
					 data = await storeFavoriteCancel(parameret)
				} 
				if (data.code == 0) {
					this.data = []
					this.stops = 0
					this.removes = []
					this.allState = 0
					this.pageNumber = 1
					this.init()
				}
			},
			all() {
				if (this.allState == 0) {
					for (let i = 0; i < this.data.length; i++) { 
						this.data[i].act = 1
					}
					this.allState = 1
				} else {
					for (let i = 0; i < this.data.length; i++) { 
						this.data[i].act = 0
					}
					this.allState = 0
				}
			},
			Tab(v, i) {
				if (this.state == 0) {
					if(this.current == 0){
						if (v.product.isMarketable == true) {
							this.$navigateTo('../GoodsDetails/GoodsDetails?id=' + v.product.id)
						}else{
							this.$u.toast(`该商品已下架`);
						}
					}else{
						this.$navigateTo('../shopDetails/shopDetails?id=' + v.store.id)
					} 
				} else {
					if (this.data[i].act == 0) { 
						this.data[i].act = 1
					} else { 
						this.data[i].act = 0
						this.allState = 0
					}
				} 
			},
			setLikes() {
				this.state = 0 
			},
			setLike() {
				this.state = 1
			},
			async init() {
				let parameret = {
					pageable: {
						pageNumber: this.pageNumber,
						pageSize: this.pageSize
					}
				}
				let data = []
				if(this.current == 0){
					data = await favoriteList(parameret)
				}else{
					data = await storeFavoriteList(parameret)
				} 
				data = data.data.content
				for (let i = 0; i < data.length; i++) {
					data[i].act = 0
					// data[i].product.images = data[i].product.images.split(',')
				}
				if (data.length != this.pageSize) {
					this.stops = 1
				}
				this.data = [...this.data, ...data]
				this.pageNumber = this.pageNumber + 1
			},
			change(index) {
				this.data = []
				this.current = index;
				this.pageNumber = 1
				this.stops = 0 
				this.init()
			}
		}
	}
</script>

<style lang="less" scoped>
	@import './index.less';
</style>
